
import { NavLink, useLocation } from 'react-router-dom';
import './index.scss'
import React from 'react';
import { connect } from 'react-redux'

import { addCartAction } from '../../store/actions/cart'



const Myfooter = (props) => {
    const { type, cart, token } = props
    const { pathname } = useLocation()
    console.log(useLocation());
    const pathArr = ['/', '/tabAllList', '/cart', '/category', '/login']
    const newpathArr = ['/', '/tabAllList', '/category', '/login']


    const gototop = (ev) => {
        document.documentElement.scrollTop = document.body.scrollTop = 0;
        ev.preventDefault();
    }
    return (<>
        {
            pathArr.indexOf(pathname) !== -1 && cart.length === 0 ? <div className='fo'>
                {type ? <NavLink to='/' exact='true'><span className=" iconfont icon-31shouyexuanzhong"></span><p>首页</p></NavLink> : <a href='####' onClick={gototop}>
                    <span className=" iconfont icon-huidingbu"></span><p>返回顶部</p> </a>}

                <NavLink to='/tabAllList'><span className="iconfont icon-gouwudai"></span>
                    <p>全部商品</p></NavLink>
                <NavLink to='/cart'><span className="iconfont icon-gouwuche"></span>
                    <p>购物车</p></NavLink>

                <NavLink to='/category'>  <span className="iconfont icon-fenlei"></span>
                    <p>分类</p></NavLink>
                {token === '' ? <NavLink to='/login'><span className="iconfont icon-yonghu"></span>
                    <p>未登录</p></NavLink> : <NavLink to='/login'><span className="iconfont icon-yonghu"></span>
                    <p>我的</p></NavLink>}
            </div> : newpathArr.indexOf(pathname) !== -1 ? <div className='fo'>
                {type ? <NavLink to='/' exact='true'><span className=" iconfont icon-31shouyexuanzhong"></span><p>首页</p></NavLink> : <a href='####' onClick={gototop}>
                    <span className=" iconfont icon-huidingbu"></span><p>返回顶部</p> </a>}

                <NavLink to='/tabAllList'><span className="iconfont icon-gouwudai"></span>
                    <p>全部商品</p></NavLink>
                <NavLink to='/cart'><span className="iconfont icon-gouwuche"></span>
                    <p>购物车</p></NavLink>

                <NavLink to='/category'>  <span className="iconfont icon-fenlei"></span>
                    <p>分类</p></NavLink>
                {token === '' ? <NavLink to='/login'><span className="iconfont icon-yonghu"></span>
                    <p>未登录</p></NavLink> : <NavLink to='/login'><span className="iconfont icon-yonghu"></span>
                    <p>我的</p></NavLink>}

            </div> : ''
        }
    </>)


}
// class Myfooter extends Component {
//     gototop = (ev) => {
//         document.documentElement.scrollTop = document.body.scrollTop = 0;
//         ev.preventDefault();
//     }
//     render() {
//         const pathArr = ['/', '/alllist', '/cart', '/category', '/login',]
//         const pathName = this.props.history.location.pathname
//         console.log(this.props);
//         const { type } = this.props
//         return (<>
//             {
//                 pathArr.indexOf(pathName) !== -1 ? <div className='fo'>
//                     {type ? <NavLink to='/' exact>
//                         <span className=" iconfont icon-31shouyexuanzhong"></span><p>首页</p></NavLink> : <a href='####' onClick={this.gototop}>
//                         <span className=" iconfont icon-huidingbu"></span><p>返回顶部</p> </a>}

//                     <NavLink to='/alllist'><span className="iconfont icon-gouwudai"></span>
//                         <p>全部商品</p></NavLink>
//                     <NavLink to='/cart'><span className="iconfont icon-gouwuche"></span>
//                         <p>购物车</p></NavLink>
//                     <NavLink to='/category'>  <span className="iconfont icon-fenlei"></span>
//                         <p>分类</p></NavLink>
//                     <NavLink to='/login'><span className="iconfont icon-yonghu"></span>
//                         <p>未登录</p></NavLink>
//                 </div> : ''
//             }</>

//         )
//     }
// }
export default React.memo(connect(
    state => ({ type: state.app.type, cart: state.cart, token: state.user.token || '' }), { addCartAction }
)(Myfooter))
